<template>
  <div>
    <HeadNav
      type="application"
      ref="head"
      :show="1"
      @publisherChange="publisherChange()"
    ></HeadNav>
    <div class="wd-1220">
      <div class="clearfix">
        <div class="float-left">
          <SlideNav type="application" sort="upload"></SlideNav>
        </div>
        <div class="float-right">
          <div class="main-container">
            <div class="model-container">
              <div
                class="model-bg"
                style="
                  position: relative;
                  min-height: 660px;
                  padding-bottom: 75px;
                "
              >
                <div class="section-title">数据导出任务列表</div>
                <div class="table">
                  <table style="table-layout: fixed">
                    <colgroup>
                      <col width="80" />
                      <col width="240" />
                      <col width="80" />
                      <col width="100" />
                      <col width="160" />
                      <col width="100" />
                      <col width="100" />
                      <col width="100" />
                      <col width="80" />
                    </colgroup>
                    <thead>
                      <tr>
                        <td>任务ID</td>
                        <td>文件名称</td>
                        <td>数据条数</td>
                        <td>功能页面</td>
                        <td>创建人</td>
                        <td style="text-align: right">状态</td>
                        <td style="text-align: right">创建时间</td>
                        <td style="text-align: right">下载时间</td>
                        <td style="text-align: right">操作</td>
                      </tr>
                    </thead>
                    <tbody v-if="fileList.length > 0">
                      <tr v-for="(item,index) in fileList" :key="index">
                        <td>{{item.id}}</td>
                        <td>
                          <span class="click-font"
                            >{{item.file_name}}</span
                          >
                        </td>
                        <td>{{item.total_count}}条</td>
                        <td>
                          <span class="main-font">{{item.module_page_name}}</span>
                        </td>
                        <td>{{item.user.name}} - {{item.user.mobile}}</td>
                        <td style="text-align: right">
                          <span class="main-font">{{item.status_text}}</span>
                        </td>
                        <td style="text-align: right">{{item.create_time?item.create_time:'--'}}</td>
                        <td style="text-align: right">{{item.download_time?item.download_time:'--'}}</td>
                        <td style="text-align: right">
                          <span class="click-font" @click="getUploadUrl(item.id)" v-if="item.status_text == '已完成'">下载</span>
                          <span class="click-font" @click="remove(item)" style="margin-left: 5px" v-if="item.status_text !== '已删除'"
                            >删除</span
                          >
                        </td>
                      </tr>
                    </tbody>
                    <tbody v-else>
                      <tr>
                        <td colspan="9" style="text-align: center">
                          <div style="padding: 160px 0"><a-empty /></div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
                <!-- 分页 -->
                <div class="pagination" v-if="fileList.length > 0">
                  <a-pagination
                    :show-total="(total) => `共 ${total} 条数据`"
                    :default-current="1"
                    :total="total"
                    :defaultPageSize="pageSize"
                    v-model="page"
                    @change="onShowSizeChange"
                  />
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <Loading ref="load" :show="1" :isLoading="isLoading"></Loading>
  </div>
</template>
<script>
import { EXPORTTASK_LISTS,EXPORTTASK_DELETE,EXPORTTASK_DOWNLOAD } from "../../apis/application.js";
export default {
  data() {
    return {
      isLoading: true,
      fileList: [],
      total: 0,
      page: 1,
      pageSize: 20,
      intervalId: null,
    };
  },
  mounted() {
    this.getList();
  },
  methods: {
    async getList() {
      var tStamp = this.$getTimeStamp();
      let data = {
        page: this.page,
        page_size: this.pageSize,
        timestamp: tStamp,
      };
      data.sign = this.$getSign(data);
      let res = await EXPORTTASK_LISTS(data);
      if (res.code == 0) {
        this.fileList = [];
        this.total = res.data.total_count;
        this.fileList = res.data.list;
        let openFlash = 0;
        res.data.list.map((value,key)=>{
          if(value.status_text !== '已完成'){
            openFlash ++;
          }
        })
        if(openFlash > 0){
          this.actualDataRefreh();
        }else{
          this.actualClear();
        }
        this.$nextTick(() => {
          this.isLoading = false;
        });
      } else {
        this.isLoading = false;
        this.$refs.head.globalTip(1, res.message, res.code);
      }
    },
    // 删除
    async deleteTask(id) {
      var tStamp = this.$getTimeStamp();
      let data = {
        id: id,
        timestamp: tStamp,
      };
      data.sign = this.$getSign(data);
      let res = await EXPORTTASK_DELETE(data);
      if (res.code == 0) {
        this.$refs.head.globalTip(2,"删除成功！",0);
        this.isLoading = true;
        this.getList();
      } else {
        this.$refs.head.globalTip(1, res.message, res.code);
      }
    },
    // 获取下载链接
    async getUploadUrl(id) {
      var tStamp = this.$getTimeStamp();
      let data = {
        id: id,
        timestamp: tStamp,
      };
      data.sign = this.$getSign(data);
      let res = await EXPORTTASK_DOWNLOAD(data);
      if (res.code == 0) {
        window.open(res.data.url,"_blank");
        this.isLoading = true;
        this.getList();
      } else {
        this.$refs.head.globalTip(1, res.message, res.code);
      }
    },
    remove(item){
      let _this = this;
      this.$confirm({
        title: "确认删除任务",
        content: "确认删除该任务吗？",
        okText: "确定",
        cancelText: "取消",
        okType: "danger",
        onOk() {
          _this.deleteTask(item.id);
        },
        onCancel() {}
      });
    },
    // 分页
    onShowSizeChange(page, pageSize) {
      this.page = page;
      this.isLoading = true;
      this.getList();
    },
    // 定时刷新数据函数
    actualDataRefreh() {
      // 计时器正在进行中，退出函数
      if (this.intervalId != null) {
        return;
      }
      let _this = this;
      // 计时器为空，操作
      this.intervalId = setInterval(() => {
        _this.isLoading = true;
        _this.getList(); //加载数据函
      }, 60000);
    },
    // 停止定时器
    actualClear() {
      clearInterval(this.intervalId); //清除计时器
      this.intervalId = null; //设置为null
    },
    publisherChange() {},
  },
};
</script>